<template>
	<div class="word-function-editor">
		<div class="t-header text">{{FORM_FUNCTION_HEADER}}</div>
		<aceEditor v-model="data"></aceEditor>
		<div class="t-footer text">{{FORM_FUNCTION_FOOTER}}</div>
	</div>
</template>

<script setup>
	import { reactive, ref, computed, onMounted } from 'vue'
	import aceEditor from "/@/components/aceEditor/index.vue";
	import request from '/@/utils/request';
	import {FORM_FUNCTION_HEADER, FORM_FUNCTION_FOOTER} from "../components.js";

	const emits = defineEmits(['update:modelValue'])

	const props = defineProps({
		modelValue: {
			type: String
		},
	})

	const data = computed({
		get() {
			return props.modelValue;
		},
		set(val) {
			emits('update:modelValue', val);
		}
	})

	onMounted(() => {
	
	})

</script>

<style lang="scss" scoped>
.word-function-editor {
	width: 100%;
	text-indent: 0;
	font-family: Courier New;
	.text {
		padding-left: 30px;
		height: 30px;
		line-height: 30px;
		background: #F4F4F5;
		color: #999;
		font-size: 16px;
	}
}
</style>